<template>
  <div class="form-logistics-preview">
    <div class="form-preview-group form-item-divider">
      <label>
        {{logisticsLabel1}} 
        <span class="form-preview-notNull" v-if="field.isNull == 0">*</span>
      </label>
      <div class="form-preview-mock">
        <div class="form-preview-control form-preview-withIcon">
          <i class="iconfont icon-fdn-select"></i>
        </div>
      </div>
    </div>
    <div class="form-preview-group form-item-divider">
      <label>
        {{logisticsLabel2}} 
        <span class="form-preview-notNull" v-if="field.isNull == 0">*</span>
      </label>
    </div>
  </div>
</template>

<script>
import { previewProps } from '@src/component/form/components/props';
import translate from '@src/component/form/mixin/translate.js'
import { transformI18n } from '@src/locales'
export default {
  name: 'form-logistics-preview',
  mixins: [translate],
  data() {
    return {
    }
  },
  props: {
    ...previewProps
  },
  computed:{
    logisticsLabel1(){
      return transformI18n('common.form.preview.logistics.companyLabel', this.formPreviewLocale)
    },
    logisticsLabel2(){
      return transformI18n('common.form.preview.logistics.oddLabel', this.formPreviewLocale)
    },
  }
};
</script>

<style lang="scss">
.form-logistics-preview {
  .form-preview-group {
    border-bottom: 1px solid $bg-color-l1;
  }
}
</style>
